<!-- 特惠商城 -->
<template>
	<view class="seller">
		<!-- 导航栏 -->
		<v-tabs name="cate_name" gutter="19" color="#eee" count="cate_count" :list="list" active-color="#000"
			:is-scroll="true" :current="current" @change="changeTabs"></v-tabs>
		<!-- 下拉菜单 -->
		<dropdown-menu @selectOption="selectOption" ></dropdown-menu>
		<!-- 商品列表 -->
		<view class="seller_box">
			<notice-list :notice="fun(notice_list,current)"  :current="current" @jumpDetail="jumpDetail"></notice-list>
		</view>
	</view>
</template>

<script>
	import {
		mapMutations,
		mapActions,
		mapState,
		mapGetters
	} from 'vuex';
	import dropdownMenu from "@/pages/seller/dropdown-menu.vue";
	export default {
		components: {
			dropdownMenu
		},
		computed:{
			// 获取vuex 数据
			...mapState({
				notice_list: state => state.init.notice,     //商家列表数据
				notice_detail: state => state.init.notice_detail,
			}),
		},
		data() {
			return {
				select: '全部',
				list: [{
						cate_name: '全部'
					}, {
						cate_name: '休闲食物'
					}, {
						cate_name: '生活服务',
					},
					{
						cate_name: '养生保健'
					}, {
						cate_name: '亲子'
					}, {
						cate_name: '休闲娱乐',
					},
				],
				current: 0,
				active: 0,
				index: 0,
				top: 0,
                list_name: "",  //选择的第一个分类的名称
				
			}
		},
		mounted() {
		},
		methods: {
			//跳转详情页
			jumpDetail(item,index) {
				this.$store.dispatch('init/get_notice_detail', item)
				uni.navigateTo({
					url: "/pages/seller/detail/index" + "?name=" + item.id + item.name
				})
			},
			//选择二级菜单
			selectOption(active, index) {
				this.active = active
				this.index = index
				// return this.active
			},
			// 打开二级菜单
			open(index) {
				this.$refs.uDropdown.highlight();
			},
			// 关闭二级菜单
			close(index) {
				this.$refs.uDropdown.highlight(index);
			},
            // 获取第一个分类的名称，以及下标
			changeTabs(index) {
				this.current = index;
                this.list_name = this.list[index].cate_name;
				this.select = this.list_name
			},
			// 从小到大
			compare(property) {
				return function (a, b) {
					var value1 = a[property];
					var value2 = b[property];
					return value1 - value2;
				}
			},
			// 从大到小
			compares(property) {
				return function (a, b) {
					var value1 = a[property];
					var value2 = b[property];
					return value2 - value1;
				}
			},
			fun(val, current) {
                let arr = [];
                let obj = [] ;
				val.forEach((item, index) => {
                    if (item.type !== '' && current == 0) {
                        arr.push(item);
                    }
					if (item.type === this.list_name && current == this.current) {
						arr.push(item);
					}
				});
				if (this.select == '全部') {
					if(this.active ==3 && this.index == 0) {
						arr.sort(this.compare('distance'))
					}
					if (this.active ==3 && this.index == 1) {
						arr.sort(this.compares('distance'))
					}
				}
				
				//不是全部时判断二级标签点击的是哪个
                if (this.select != '全部') {
                    arr.forEach((item,index) => {
                        if (this.select == item.type) {
                            obj.push(item);
                        }
                    })
					// 好评数
					if (this.active == 1 && this.index == 0 ) {
						obj.sort(this.compare('num'))
					}
					if (this.active == 1 && this.index == 1 ) {
						obj.sort(this.compares('num'))
					}
					//兑换量
					if (this.active == 2 && this.index == 0 ) {
						obj.sort(this.compare('num'))
					}
					if (this.active == 2 && this.index == 1 ) {
						obj.sort(this.compares('num'))
					}
					// 距离远近
					if(this.active ==3 && this.index == 0) {
						obj.sort(this.compare('distance'))
					}
					if (this.active ==3 && this.index == 1) {
						obj.sort(this.compares('distance'))
					}
                    arr = obj;
                }
                return arr;
			},
		},

	}
</script>

<style lang="scss" scoped>
	@import './index.scss';
</style>
